<template>
	<scroll-view scroll-y="true" class="container">
		<view v-if="info.length===0">
			<luanqing-empty :show="true" text="没有更多数据啦" textColor="#000"></luanqing-empty>
		</view>
		<view class="list" v-for="(item,index) in info" :key="index">
			<view>
				<navigator :url="'./detail?goods_id='+item.goods_id" hover-class="none" class="content">
					<view class="pic">
						<image :src="item.thumb" mode=""></image>
					</view>
					<view class="detail">
						<text class="title">{{item.shop_name}}</text>
						<!-- <view class="shop_name">
							{{}}
						</view> -->
						<view class="local">
							<image src="../../../static/icon/shijian2.png" mode=""></image>
							<text>{{item.spec_value}}</text>
						</view>
						<view class="phone">
							<image src="../../../static/img/shijian.png" mode=""></image>
							<text>{{item.class_time}}</text>
						</view>
					</view>
				</navigator>
				<view class="teacherIntro">
					<navigator :url="'./detail?goods_id='+item.goods_id" hover-class="none" class="avatar">
						<image :src="item.contact_image" mode=""></image>
					</navigator>
					<navigator :url="'./detail?goods_id='+item.goods_id" hover-class="none" class="intro">
						<view class="teacherName">
							<text>{{item.contact_name}}</text>
						</view>
						<view class="dianhua">
							<text>电话：{{item.contact_phone}}</text>
						</view>
					</navigator>
					<navigator :url="'../leave/index?goods_id='+item.goods_id" hover-class="none" class="qingjia">
						请假
					</navigator>
				</view>
			</view>
		</view>
	</scroll-view>
</template>

<script>
	export default{
		data(){
			return{
				info:'',
			}
		},
		created() {
			uni.showLoading({
				title:"加载中...",
				mask:true
			})
			uni.getStorage({
				key: 'user_info',
				success: (res) => {
					this.token = res.data.token;
					this.getData()
				},
				fail: (res) => {
					uni.redirectTo({
						url: '../../login/auth'
					});
				}
			});
		},
		methods:{
			getData(){
				uni.request({
					url: `https://mx.acktechnologies.com.cn/api/wxapp/mine/index/myGrade`,
					data: {
						"token": this.token,
					},
					method: 'GET',
					success: res => {
						console.log(res)
						uni.hideLoading();
						if (res.data.code === 1) {
							this.info = res.data.data;
						} else if (res.data.code === 403) {
							uni.redirectTo({
								url: '../../login/auth'
							});
						} else {
							uni.showToast({
								title: '服务器开小差了呢，请您稍后再试',
								icon: 'none'
							})
						}
					},
					fail: () => { //接口请求失败的处理
						uni.showToast({
							title: '服务器开小差了呢，请您稍后再试',
							icon: 'none'
						})
					},
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.container{
		padding-bottom: 20rpx;
		min-height: 100%;
	}
	.list {
		width: 670rpx;
		height: 362rpx;
		background: #FFFFFF;
		box-shadow: 0px 4rpx 20rpx 0px #E9EBF6;
		border-radius: 16rpx;
		padding: 20rpx;
		margin: 20rpx auto;

		.content {
			width: 628rpx;
			height: 240rpx;
			margin: 0 auto;
			border-bottom: 1px solid #EBEBEB;
			box-sizing: border-box;
			display: flex;
			flex-direction: row;
			align-items: center;

			.pic {
				width: 200rpx;
				height: 200rpx;
				border-radius: 10rpx;
				flex-shrink: 0;

				image {
					display: block;
					width: 100%;
					height: 100%;
					border-radius: 10rpx;
				}
			}

			.detail {
				flex-shrink: 0;
				margin-left: 20rpx;

				.title {
					font-size: 32rpx;
					font-weight: 500;
					color: #333333;
					line-height: 24rpx;
				}

				.local {
					margin-top: 16rpx;
				}

				.local,
				.phone {
					display: flex;
					align-items: flex-start;

					
					text {
						font-size: 26rpx;
						font-family: SourceHanSansCN-Normal, SourceHanSansCN;
						font-weight: 400;
						color: #666666;
						line-height: 36rpx;
					}
				}

				.phone {
					margin-top: 8rpx;
					image {
						width: 26rpx;
						height: 24rpx;
						margin: 6rpx 8rpx 0 0;
						flex-shrink: 0;
					}
				}
				.local image{
					width: 26rpx;
					height: 26rpx;
					margin: 6rpx 8rpx 0 0;
					flex-shrink: 0;
				}
			}
		}

		.teacherIntro {
			height: 80rpx;
			margin-top: 22rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-start;
			margin-left: 22rpx;
			.avatar {
				width: 80rpx;
				height: 80rpx;
				border-radius: 50%;

				image {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
				}
			}

			.intro {
				width: 420rpx;
				padding-left: 20rpx;
				box-sizing: border-box;

				.teacherName {
					font-size: 30rpx;
					font-family: SourceHanSansCN-Normal, SourceHanSansCN;
					font-weight: 400;
					color: #666666;
				}

				.dianhua {
					font-size: 26rpx;
					font-family: SourceHanSansCN-Normal, SourceHanSansCN;
					font-weight: 400;
					color: #999999;
					margin-top: 10rpx;
				}
			}

			.juli {
				font-size: 30rpx;
				font-family: SourceHanSansCN-Normal, SourceHanSansCN;
				font-weight: 400;
				color: #999999;
				text-align: right;
			}
			.qingjia{
				width: 122rpx;
				height: 48rpx;
				line-height: 48rpx;
				background: linear-gradient(90deg, #9BDFB5 0%, #84DFD1 100%);
				border-radius: 24rpx;
				font-size: 28rpx;
				font-family: SourceHanSansCN-Normal, SourceHanSansCN;
				color: #FFFFFF;
				text-align: center;
				box-shadow: 0rpx 0rpx 30rpx 5rpx #9BDFB5;
			}
		}
	}
</style>
